@tailwind base;
@tailwind components;
@tailwind utilities;

/* 基础样式 */
@layer base {
  body {
    @apply font-sans text-gray-800 bg-white;
  }

  h1 {
    @apply text-4xl font-bold;
  }

  h2 {
    @apply text-3xl font-bold;
  }

  h3 {
    @apply text-2xl font-bold;
  }

  h4 {
    @apply text-xl font-bold;
  }

  h5 {
    @apply text-lg font-bold;
  }

  h6 {
    @apply font-bold;
  }
}

/* 组件样式 */
@layer components {
  .container {
    @apply max-w-7xl mx-auto px-4 sm:px-6 lg:px-8;
  }

  .section {
    @apply py-16 md:py-24;
  }

  .section-title {
    @apply text-center mb-12;
  }

  .btn {
    @apply inline-flex items-center justify-center px-6 py-3 border border-transparent rounded-md font-medium focus:outline-none focus:ring-2 focus:ring-offset-2 transition-colors;
  }

  .btn-primary {
    @apply bg-primary text-white hover:bg-primary-dark focus:ring-primary;
  }

  .btn-secondary {
    @apply bg-secondary text-white hover:bg-secondary-dark focus:ring-secondary;
  }

  .btn-outline {
    @apply bg-transparent border-gray-300 text-gray-700 hover:bg-gray-50 focus:ring-gray-500;
  }
}

/* 自定义变量 */
:root {
  --color-primary: #3b82f6;
  --color-primary-dark: #2563eb;
  --color-secondary: #1e293b;
  --color-secondary-dark: #0f172a;
}